﻿<!DOCTYPE html>
<html lang="en">

<head>
    <meta charset="utf-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width,initial-scale=1.0">
    <title>phone</title>
    <!-- <script data-main="./static/newPhone/js/main.js" src="./static/newPhone/lib/require.js"></script> -->
    <script src="https://cdn.jsdelivr.net/npm/vue@2/dist/vue.js"></script>
    <!-- 引入ElementUI样式 -->
    <link rel="stylesheet" href="https://unpkg.com/element-ui/lib/theme-chalk/index.css">
    <!-- 引入ElementUI组件库 -->
    <script src="https://unpkg.com/element-ui/lib/index.js"></script>
    <script src="./static/hyPhone/js/jquery.js" type="text/javascript"></script>
    <script src="./static/hyPhone/js/socket.io.min.js" type="text/javascript"></script>
    <script src="./static/hyPhone/js/jssip-3.9.0.js" type="text/javascript"></script>
    <script src="./static/hyPhone/js/webrtc-phone-jssip.js" type="text/javascript"></script>
    <script src="./static/hyPhone/js/web-agent.js" type="text/javascript"></script>
    <script data-main="./static/hyPhone/js/main.js" src="./static/hyPhone/js/require.js"></script>
    <!-- <script data-main="./hyPhone/js/main.js" src="js/require.js"></script> -->
    <!-- <script src="./hyPhone/js/main.js" type="text/javascript"></script> -->
    <!-- <script data-main="./static/newPhone/js/main.js" src="./static/newPhone/lib/require.js"></script> -->
    <script>
        // var getChildCallBarFun = null;
        // var audioRemote = document.getElementById("audio_remote");
        window.toCallBarParams = function (fun) {
            getChildCallBarFun = fun;
        }
        // window.onbeforeunload = function () {	//设置默认sessionStorage值
        //     window.sessionStorage.removeItem("phoneUserInfo");
        //     window.sessionStorage.removeItem("from");
        // }
    </script>
    <script>
        var IVRDataDemo = '';
        window.IVRData = '';
        let from = JSON.parse(window.sessionStorage.getItem('phoneUserInfo'))
        // console.log(from)

        if (from != null) {
            var newPhoneUserInfo = {
                httpServerAddress: 'https://v4.aiccyun.com',
                agentID: from.agentID,
                entId: 'JSSJ',
                password: from.password,
                sipUser: from.sipUser,
                TerminalType: '5',
                agentDnPwd: '1234',
                autoRTCAnswer: true,
                serverUrl: 'v4.aiccyun.com',
                wsUrl: 'v4.aiccyun.com:21000',
                udpUrl: 'v4.aiccyun.com:35065',
                stunServers: '81.70.204.246:3478',
                channel: 'external', // 接入渠道：外部接入-external(写死即可); 
                positionX: '20',
                positionY: '180',
                alertScreen: function (obj) {
                    console.log('=======暴漏出的事件', obj)
                    // if(!$('.box')[0]) return;
                    // _vm = $('.box')[0].__vue__;
                    // $('.side_bar')[0].__vue__.$refs.callBar[0].$el.click();
                    // getChildCallBarFun(obj);
                    this.$router.push({
                    name:"identification"
                })
                }
                
            }
            window.phoneUserInfo = newPhoneUserInfo;
            console.log(obj)
            // if(obj){
            //     this.$router.push({
            //         name:"identification"
            //     })
            // }
        }
        // function checkPhoneInfo() {
        //     var fromInfo = window.sessionStorage.getItem("from");
        //     if (from != null && from != undefined) {
        //         if (fromInfo == 0) {
        //             startOtherPlugin();
        //         }
        //     } else {
        //         if (fromInfo == 1) {
        //             cancelOtherPlugin();
        //         }
        //     }
        // }
        // setInterval(checkPhoneInfo, 3000);
        // var phoneUserInfo = {
        //     httpServerAddress : 'http://cc.aiccyun.com/cca',
        //     agentID : from.agentID,
        //     entId: 'JSSJ',
        //     password:from.password,    // 原始密码不需要MD5
        //     sipUser: from.sipUser,
        //     TerminalType: '5',
        //     positionX: '20',
        //     positionY: '180',
        //     alertScreen: function(obj) {
        //         console.log('接听来电的回调-----请在这里写来电弹屏页面', obj)
        //         // if(obj){
        //     //     this.$router.push({
        //     //         name:"identification"
        //     //     })
        //     // }
        //     }
        // }
        //     {
        //     "ANI": "01084928888", 
        //     "CallType": "INTERNAL", 
        //     "DNIS": "15321460217", 
        //     "EventType": "AgentStatus_Alerting", 
        //     "IVRData": "SG:投诉（4177）", 
        //     "callDetailList": [
        //         {
        //             "callTime": "2022-08-02 16:21:15", 
        //             "userType": "1", 
        //             "content": "欢迎致电金色世纪，酒店请按一，国内机票火车票请按二，国际业务请按三、旅游请按四，租车请按五，投诉请按六，会员服务请按七，重听请按星号键", 
        //             "userSayType": null
        //         }, 
        //         {
        //             "callTime": "2022-08-02 16:21:28", 
        //             "userType": "2", 
        //             "content": "6", 
        //             "userSayType": "2"
        //         }, 
        //         {
        //             "callTime": "2022-08-02 16:21:28", 
        //             "userType": "1", 
        //             "content": "为提升我们的服务质量，本次通话将被录音，请您在通话后对我们的服务做出评价。", 
        //             "userSayType": null
        //         }
        //     ], 
        //     "SessionID": "6e62e8de7b1c6f78:JSSJ"
        // }
        var aaa = setInterval(login, 1000)
        var write
        let is = window.sessionStorage.setItem('from', 0)
        // 登录定时器监听
        function login() {
            is = window.sessionStorage.getItem('from')
            // console.log('登录监听')
            if (is == 1) {
                clearInterval(aaa)
                this.startOtherPlugin()
                aaa = null
                // console.log('登录成功')
                write = setInterval(getwrite, 1000)
            } else {}
        }
        // 登出定时器监听
        function getwrite() {
            is = window.sessionStorage.getItem('from')
            // console.log('注销监听')
            if (is == 0) {
                clearInterval(write)
                // console.log('注销成功')
                this.cancelOtherPlugin()
                aaa = setInterval(login, 1000)
            } else {}
        }
        // 登录时启动
        function startOtherPlugin() {
            console.log(1112)
            console.log('phone')
            // window.phoneUserInfo = phoneUserInfo;
            var phone = window.phone;
            phone.defineEvent('btn_login');
            // window.sessionStorage.setItem("isHyPhone", true);
        }
        // 注销时结束
        function cancelOtherPlugin() {
            // console.log('登出')
            var phone = window.phone;
            phone.defineEvent('btn_logout');
            // window.sessionStorage.removeItem("isHyPhone");
        }
    </script>
    <!--<script src="./js/main.js"></script>-->
    <style>
        .login {
            margin-left: 95%;
        }

        button.btnInit,
        button.btn_login,
        button.btn_login1,
        button.btn_logout,
        button.btn_logout1,
        button.callout,
        button.btnStartMute,
        button.btnEndMute {
            display: inline-block;
            line-height: 1;
            white-space: nowrap;
            cursor: pointer;
            background: #fff;
            border: 1px solid #bfcbd9;
            border-color: #c4c4c4;
            color: #1f2d3d;
            -webkit-appearance: none;
            text-align: center;
            box-sizing: border-box;
            outline: none;
            margin: 0;
            -moz-user-select: none;
            -webkit-user-select: none;
            -ms-user-select: none;
            padding: 10px 15px;
            font-size: 14px;
            border-radius: 4px;
        }

        button.btn_login,
        button.btn_login1 {
            color: #fff;
            background-color: #13ce66;
            border-color: #13ce66;
        }

        button.btn_logout,
        button.btn_logout1 {
            color: #fff;
            background-color: #ff4949;
            border-color: #ff4949;
        }

        button.btnStartMute {
            color: #fff;
            background: #e69e20;
            border-color: #e69e20;
        }

        #textarea {
            list-style: none;
            padding: 10px;
        }

        #textarea>li {
            margin-bottom: 10px;
        }

        #textarea>li>span {
            color: #50bfff;
        }

        #inputNum,
        #agentId,
        #agentPwd,
        #agentDn,
        #dataKey,
        #dataVal,
        #getDataKey {
            background-color: #fff;
            background-image: none;
            border-radius: 4px;
            border: 1px solid #bfcbd9;
            box-sizing: border-box;
            color: #1f2d3d;
            display: inline-block;
            font-size: inherit;
            height: 36px;
            line-height: 1;
            outline: none;
            padding: 3px 10px;
            transition: border-color .2s cubic-bezier(.645, .045, .355, 1);
            width: 160px;
        }

        #httpServerAddress {
            background-color: #fff;
            background-image: none;
            border-radius: 4px;
            border: 1px solid #bfcbd9;
            box-sizing: border-box;
            color: #1f2d3d;
            display: inline-block;
            font-size: inherit;
            height: 36px;
            line-height: 1;
            outline: none;
            padding: 3px 10px;
            transition: border-color .2s cubic-bezier(.645, .045, .355, 1);
            width: 200px;
        }

        .box {
            width: 1000px;
            overflow-y: hidden;
        }

        /*17601634501*/
        /* node 执行命令 node r.js -o build.js*/
    </style>

</head>

<body class="box">
    <div>
        <audio id="audio_remote" autoplay="autoplay"> </audio>
        <!-- <button class="btn_login">登入</button>
<button class="btn_logout disabled">登出</button> -->
        <!-- <div onclick="startOtherPlugin()">登入</div>
        <div onclick="cancelOtherPlugin()">登出</div> -->
    </div>
    <!-- <br/>
<div>
    <label for="inputNum">测试外呼</label>
    <input id="inputNum" type="text">
    <button id="callout" class="callout">外呼</button>
</div>
<br/>
<div style="padding:1.25rem">
    <ul id="textarea" style="width:50rem;height:43.75rem;border:.0625rem solid #aaa"></ul>
</div> -->
    <!-- <div id="appy">
        <div style="display:flex;margin:0 0 0 88%;">
            <div style="margin:0 20px 0 0;" @click="dialogFormVisible = true">登录</div>
            <div class="logi" @click="cancelOtherPlugin()"> 登出</div>
        </div>
        <div style="position: absolute;height:500px;z-index:99999;">
            <el-dialog title="华云外呼登录" :visible.sync="dialogFormVisible" width="500px" :close-on-click-modal="false">
                <el-form :model="form" label-position="left" :rules="rules" ref="ruleForm">
                    <el-form-item label="网址:" :label-width="formLabelWidth" prop="httpServerAddress">
                        <el-input v-model="form.httpServerAddress" autocomplete="off" :disabled="true"></el-input>
                    </el-form-item>
                    <el-form-item label="账号:" :label-width="formLabelWidth" prop="agentID">
                        <el-input v-model="form.agentID" autocomplete="off"></el-input>
                    </el-form-item>
                    <el-form-item label="密码:" :label-width="formLabelWidth" prop="password">
                        <el-input v-model="form.password" autocomplete="off" show-password></el-input>
                    </el-form-item>
                    <el-form-item label="分机号:" :label-width="formLabelWidth" prop="sipUser">
                        <el-input v-model="form.sipUser" autocomplete="off"></el-input>
                    </el-form-item>
                </el-form>
                <div slot="footer" class="dialog-footer">
                    <el-button @click="dialogFormVisible = false">取 消</el-button>
                    <el-button type="primary" @click="startOtherPlugin('ruleForm')">登录</el-button>
                </div>
            </el-dialog>
        </div>

    </div> -->
    <script>
        new Vue({
            el: '#appy',
            data: function () {
                return {
                    statusphone: true,
                    formLabelWidth: "70px",
                    dialogFormVisible: false,
                    form: {
                        statusphone: 'true',
                        httpServerAddress: "https://v4.aiccyun.com",
                        agentID: "8001",
                        entId: "JSSJ",
                        password: "!dfDgF45353..",
                        sipUser: "50001",
                        TerminalType: "5",
                        positionX: "20",
                        positionY: "180",
                        alertScreen: function (obj) {
                            console.log("接听来电的回调-----请在这里写来电弹屏页面", obj);
                        },

                    },
                    rules: {
                        httpServerAddress: [{
                            required: true,
                            message: "请输入账号",
                            trigger: "blur"
                        }, ],
                        agentID: [{
                            required: true,
                            message: "请输入账号",
                            trigger: "blur"
                        }],
                        password: [{
                            required: true,
                            message: "请输入密码",
                            trigger: "blur"
                        }],
                        sipUser: [{
                            required: true,
                            message: "请输入分机号",
                            trigger: "blur"
                        }],
                    },
                }
            },
            methods: {
                cancelOtherPlugin() {
                    window.sessionStorage.setItem("from", 0);
                    this.is = true;
                },
                logOut() {
                    this.logOutDialog = true
                },
                // 华云登录
                startOtherPlugin(formName) {
                    this.$refs[formName].validate((valid) => {
                        if (valid) {
                            // this.$router.go(0)
                            // location.replace(location.href); 
                            // statusphone=true
                            // $("body").append(phoarray);
                            // window.phoneUserInfo = this.form;
                            window.sessionStorage.setItem(
                                "phoneUserInfo",
                                JSON.stringify(this.form)
                            );
                            window.sessionStorage.setItem("from", 1);
                            // window.sessionStorage.setItem("statusphone", true);
                            this.dialogFormVisible = false;
                            this.is = false;
                            console.log(window)
                            window.phone.defineEvent('btn_login');
                            // window.phone.defineEvent('buttonphone');
                        } else {
                            return false;
                        }
                    });
                },

            }
            //         startOtherPlugin(formName) {
            //     this.$refs[formName].validate((valid) => {
            //       if (valid) {
            //         // window.phoneUserInfo = this.form;
            //         window.sessionStorage.setItem(
            //           "phoneUserInfo",
            //           JSON.stringify(this.form)
            //         );
            //         window.sessionStorage.setItem("from", 1);
            //         this.dialogFormVisible = false;
            //         this.is = false;
            //         console.log(window)
            //         window.phone.defineEvent('btn_login');
            //       } else {
            //         return false;
            //       }
            //     });
            //   },

        });
    </script>
</body>

</html>